{% extends "::base.html.twig" %}

{% block title %}Tous les Quizz{% endblock %}

{% block other %}
<h1><i id="openMenu" class="icon-list tooltips" title="Ouvrir le Menu"></i>Gérer les Quizz</h1>{% endblock %}
{% block other2 %}
<div id="promo" class=".col-md-4">
	<h1 class="grey">Promotions</h1>
	{% set j=0 %}
	{% for i in quizz %}
		<div class="promo {% if promo is defined %}{% if i.promoid==promo %}first{% endif %}{% else %}{% if j==0 %}first{% set j=1 %}{% endif %}{% endif %}" data-id="tab{{i.promoid}}" data-pid="{{i.promoid}}">{{i.promo}} <i class="icon-uniE646"></i></div>
	{% endfor %}
</div>
{% endblock %}
{% block body %}
<a href="{{path('createQuizz')}}" class="add"><i class="icon-plus blue"></i>Ajouter un quizz</a>
<div id="quizz">
	{% for q in quizz %}
			<ul id="tab{{q.promoid}}">
			<h1 style="margin-left: 0 !important; margin-right: 0 !important; width: 100%;"> {{q.promo}}</h1>
		    {% for item in q.quizz %}
			    <li  class="{% if item.q.active %}active {% endif %}{% if item.fait is defined %} fait {% endif %}">
			    	Quizz n°{{item.q.id}} - {{ item.q.titre }} 
			    	
			    	{% if not item.fait is defined %}
				    	{% if not item.q.active %}
				    		<a href="{{path('deleteQuizz',{id:item.q.id}) }}"><i class="icon-remove round red tooltips" title="Supprimer"></i></a>
			    			<a href="{{path('updateQuizz',{id:item.q.id}) }}">
			    				<i class="icon-pencil round tooltips" title="Editer"></i>
			    			</a>
				    		<a href="{{path('readQuestion',{id:item.q.id}) }}" title="Ajouter des Questions">
				    			<i class="icon-enter tooltips" title="Gérer les questions"></i>
				    		</a>
				    	{% endif %}
			    	{% endif %}
			    		<a href="{{path('activateQuizz',{idQuizz:item.q.id}) }}"><i class="icon-pushpin tooltips" title="Activer/Désactiver"></i></a>
			    </li>
		    {% endfor %}
		</ul>
    {% endfor %}
</div>
	<div id="info">
		<i class="icon-info2 tooltips round black"  title="Pour changer de promotion, cliquez sur le bouton <b class='icon-list'></b><br/> La promotion séléctionnée est enregistrée pour le prochain chargement.">
		</i>
	</div>
	<script>
		$(document).ready(function(){
			$('#openMenu').on('click',function(){
				$("#promo").animate({left:0},750);
			});
			$("#promo").on('click',' .promo',function(){
				elem=$(this).parent();
				if(window.screen.width>550){
					elem.animate({left:-400},750);
				}else{
					$("html,body").animate({scrollTop:$("#quizz").offset().top});
				}
				if(!$(this).attr("class").match("active")){
					if(typeof($("#promo .active").attr("class"))!="undefined"){
						$("#"+$("#promo .active").attr("data-id")).slideUp();
						$("#promo .active").removeClass('active');
					}
					$(this).addClass('active');
					$("#"+$(this).attr("data-id")).slideDown();
					$.ajax({
						url: '{{ path("setSessionQuizz") }}',
						type: 'POST',
						data: {id: $(this).attr("data-pid") }
					});
					
				}
			});
			$("#promo .first").addClass('active');
			$("#"+$("#promo .first").attr("data-id")).show();
		});
	</script>

{% endblock %}
